

import React,{Component} from 'react';


import './Popup.less'


class Popup extends Component {

    constructor(props){
        super(props);
        this.state = {show:props.show};

        this.bgClickHandle = this.bgClickHandle.bind(this);
    }


    bgClickHandle(event){

        if (event.currentTarget == event.target){
            this.setState({show:false});
        }

    }


    componentWillReceiveProps(nextProps){
        this.setState({show:nextProps.show});
    }

    render(){

        let popupStyle = {
            display: this.state.show ? "block" : "none"
        }

        return (
            <div className="popup" style={popupStyle} onClick={this.bgClickHandle}>
                <div className="content-container">{this.props.children}</div>
            </div>
        );
    }
}



export default Popup;